<template>
  <div class="yinyue">
    <audio
      class="banxin"
      :src="this.Url"
      controls
      autoplay
      @mouseenter="add"
    ></audio>
  </div>
</template>

<script>
export default {
  data() {
    return {
      Url: [],
    };
  },
  methods: {
    add() {
      // this.$store.commit("chageyinyueUrl");
      this.Url = this.$store.state.YinyeuId.url;
      console.log(this.$store.state.YinyeuId.url);
    },
  },
  created() {
    this.add();
    this.Url = this.$store.state.YinyeuId.url;
    console.log(this.$store.state.yinyueUrl);
  },
};
</script>
 
<style lang = "less" scoped>
@import "../assets/base.less";

.yinyue {
  width: 100%;
  height: 50px;
  position: fixed;
  bottom: -48px;
  background-color: black;
  &:hover {
    bottom: 0px;
  }
  audio {
    display: flex;
  }
}
</style>